<template>
	<view>
		<!-- 我的1 -->
		<view class="top">
			<view class="top_un">
				<view class="topun_img">
					<image src="../../static/images/juserimg.png"
						style="width: 85%;height: 70px;margin-left: 10px;margin-top: 10px;border-radius: 50%;"></image>
				</view>
				<view class="topun_news">
					<view class="news_name" @click="tonews()">梦想</view>
					<view class="news_phone">15831077115</view>
				</view>
				<view class="top_ew">
					<image src="../../static/images/jusererwei.png"
						style="width: 100%;height: 35px;margin-top: 30px;margin-left: 13px;"></image>
				</view>
			</view>
			<view class="top_dw">
				<view class="topdw_menu" v-for="(item,index) in menufirst">
					<view class="menu_price">
						{{item.price}}
					</view>
					<view class="menu_wenzi" @click="tobalance(item,index)">
						{{item.title}}
					</view>
				</view>
			</view>
		</view>

		<view class="userbiao">
			<view class="biao_left">
				订单中心
			</view>
			<view class="biao_right" @click="tocenter()">
				查看全部>
			</view>
		</view>

		<view class="menusecond">
			<view class="second_list" v-for="(item,index) in menusecond" key="index">
				<view class="list_img">
					<image :src="item.img" style="width: 40px;height: 35px;margin-left: 20px;margin-top: 15px;"></image>
				</view>
				<view class="list_name">
					{{item.name}}
				</view>
			</view>
		</view>

		<view class="userlogo">
			<image src="../../static/images/juserbiao.png" style="width: 96%;height: 100%;margin-left: 2%;"></image>
		</view>

		<view class="menuthird">
			<view class="menuthird_listtwo" v-for="(item,index) in menuthird" key="index">
				<view class="listtwo_img">
					<image :src="item.img" style="width: 40px;height: 35px;margin-left: 50px;margin-top: 20px;"></image>
				</view>
				<view class="listtwo_name" @click="tomenuthird(item,index)">
					{{item.name}}
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				menufirst: [{
						price: '234.00',
						title: '余额'
					},
					{
						price: '0',
						title: '积分'
					},
					{
						price: '5',
						title: '关注'
					},
					{
						price: '1',
						title: '优惠券'
					}
				],
				menusecond: [{
						img: '../../static/images/jusermenu1.png',
						name: '待付款'
					},
					{
						img: '../../static/images/jusermenu2.png',
						name: '待发货'
					},
					{
						img: '../../static/images/jusermenu3.png',
						name: '待收获'
					},
					{
						img: '../../static/images/jusermenu4.png',
						name: '待评价'
					},
					{
						img: '../../static/images/jusermenu5.png',
						name: '售后/退款'
					}
				],
				menuthird: [
					{img: '../../static/images/jusermenu6.png',
						name: '社区信息'
					},
					{
						img: '../../static/images/jusermenu7.png',
						name: '申请团长'
					},
					{
						img: '../../static/images/jusermenu8.png',
						name: '我的地址'
					},
					{
						img: '../../static/images/jusermenu9.png',
						name: '积分商城'
					},
					{
						img: '../../static/images/jusermenu10.png',
						name: '签到领积分'
					},
					{
						img: '../../static/images/jusermenu11.png',
						name: '在线客服'
					},
				]
			}
		},
		methods: {
			tonews() {
				uni.navigateTo({
					url: 'userinfos/userinfos'
				})
			},
			tobalance(item, index) {
				console.log(item, index, 111)
				if (index == 0) {
					uni.navigateTo({
						url: 'balance/balance'
					})
				}else if(index==3){
					uni.navigateTo({
						url:'purchase-center/MainCoupon'
					})
				}

			},
			tocenter(){
				uni.navigateTo({
					url:'purchase-center/Purchase-center'
				})
			},
			tomenuthird(item,index){
				console.log(item, index, 333)
				if (index == 0) {
					uni.navigateTo({
						url: 'purchase-center/CommunitInformation'
					})
				}else if(index==1){
					uni.navigateTo({
						url:'purchase-center/ApplyHead'
					})
				}else if(index==2){
					uni.navigateTo({
						url:'../home/SecKill-active/Product-details/settlement/Receiving-Address/Receiving-Address'
					})
				}
				else if(index==3){
					uni.navigateTo({
						url:'purchase-center/Integralmall'
					})
				}else if(index==4){
					uni.navigateTo({
						url:'purchase-center/SignIn'
					})
				}
				else if(index==5){
					uni.navigateTo({
						url:'purchase-center/CustomerService'
					})
				}
			}
		}
	}
</script>

<style scoped>
	.top {
		width: 96%;
		margin-left: 2%;
		height: 180px;
		background-color: #F84D39;
		color: #fff;
		border-radius: 5px 5px 10px 10px;
	}

	.top_un {
		width: 100%;
		height: 100px;
		display: flex;
		flex-wrap: nowrap;
	}

	.topun_img {
		width: 20%;
		height: 100px;
	}

	.topun_news {
		width: 50%;
		height: 100px;
		margin-left: 2%;
	}

	.news_name {
		width: 100%;
		height: 30px;
		line-height: 30px;
		margin-top: 17px;
		font-size: 14px
	}

	.news_phone {
		width: 100%;
		height: 30px;
		line-height: 30px;
	}

	.top_ew {
		width: 25%;
		height: 100px;
	}

	.top_dw {
		width: 100%;
		height: 80px;
		display: flex;
		flex-wrap: nowrap;
	}

	.topdw_menu {
		width: 25%;
		height: 80px;
	}

	.menu_price {
		width: 100%;
		height: 40px;
		line-height: 40px;
		font-weight: 600;
		text-align: center;
	}

	.menu_wenzi {
		width: 100%;
		height: 40px;
		text-align: center;
		line-height: 20px;
	}

	.userbiao {
		width: 96%;
		height: 40px;
		line-height: 40px;
		margin-left: 2%;
		display: flex;
		flex-wrap: nowrap;
	}

	.biao_left {
		width: 50%;
		height: 40px;
		text-align: left;
		font-size: 14px;
	}

	.biao_right {
		width: 50%;
		height: 40px;
		text-align: right;
		color: #CCCCCC;
		font-size: 14px;
	}

	.menusecond {
		width: 96%;
		margin-left: 2%;
		height: 100px;
		margin-top: 5px;
		display: flex;
		flex-wrap: nowrap;
		background-color: #fff;
	}

	.second_list {
		width: 20%;
		height: 100px;
	}

	.lists_img {
		width: 100%;
		height: 80px;
	}

	.list_name {
		width: 100%;
		height: 20px;
		line-height: 20px;
		font-size: 12px;
		text-align: center;
	}

	.userlogo {
		width: 100%;
		height: 90px;
		margin-top: 10px;
	}

	.menuthird {
		width: 96%;
		margin-left: 2%;
		height: 220px;
		margin-top: 10px;
		display: flex;
		flex-wrap: wrap;
		background-color: #fff;
	}

	.menuthird_listtwo {
		width: 33%;
		height: 100px;
	}

	.listtwo_img {
		width: 100%;
		height: 80px;
	}

	.listtwo_name {
		width: 100%;
		height: 20px;
		line-height: 20px;
		font-size: 12px;
		text-align: center;
	}
</style>
